<template>
    <eui-popup ref="CustContactPopup" :type="type" :animation="false" background-color="#fff" :mask-click="false">
			<view class="popup-content">
				<view class="popup-title flex just-between">
					<view style="font-weight: bold;">
						联系顾客
					</view>
					<bcm-close-btn @click="close"></bcm-close-btn>
				</view>
				<view v-if="orderType == 'order'"
					style="padding-left: 30rpx;color: #000;background-color:#fff;box-sizing: border-box;padding-top:24rpx;font-size: 32rpx; line-height: 40rpx;">
					<view>
						<text v-if="scope.consigneeName">姓名：{{ scope.consigneeName }}</text>
						<text v-if="scope.consigneePhoneLast">(尾号{{ scope.consigneePhoneLast }})</text>
					</view>
					<view><text v-if="scope.privacyConsigneePhone">电话：{{ scope.privacyConsigneePhone }}</text>
					</view>
					<view class="bottom-1" style="margin: 100rpx 0 50rpx 0;">
						<eui-button type="max" title="拨打电话" style="width: 50%" @click="click('1')" />
					</view>
				</view>
				<view  v-else
					style="padding-left: 30rpx;color: #000;background-color:#fff;box-sizing: border-box;padding-top:24rpx;font-size: 32rpx; line-height: 40rpx;">
					<view>
						<text v-if="scope.contactName">姓名：{{ scope.contactName }}</text>
						<text v-if="scope.consigneePhoneLast">(尾号{{ scope.consigneePhoneLast }})</text>
					</view>
					<view>
						<text v-if="scope.privacyContactPhone">电话：{{ scope.privacyContactPhone }}</text>
					</view>
					<view class="bottom-1" style="margin: 100rpx 0 50rpx 0;">
						<eui-button type="max" title="拨打电话" style="width: 50%" @click="click('2')" />
					</view>
				</view>
			</view>
		</eui-popup>
</template>
<script>
import BcmCloseBtn from '../../components/BcmCloseBtn.vue';
import {makePhoneCall} from '../../../../hooks/bcmUseUntils';
    export default {
		name: "CustContactPopup",
		props: {
			scope: {
				type: Object,
				default: {}
			},
			type: {
				type: String,
				default: 'bottom'
			},
			show: {
				type: Boolean,
				default: false
        	},
			orderType: {
				type: String,
				default: 'order'
			},
		},
		components: {
			BcmCloseBtn
		},
		watch: {
			show: {
				handler(val) {
					// console.log(val, 'val')
					if (val) {
						this.$refs.CustContactPopup.open('bottom');
					}else{
						this.close()
					}
				},
			}
		},
		data() {
			return {
				
			}
		},
		methods: {
            close() {
			    this.$refs.CustContactPopup.close();
				this.$emit('close');
		    },
			click(type) {
				type=='1' && makePhoneCall(this.scope.privacyConsigneePhone);
				type=='2' && makePhoneCall(this.scope.privacyContactPhone);
			}
        }
    }
</script>
<style lang="scss" scoped>
@import '@/static/font/enjoyicon/iconfont.css';
@import '../../common/common.css';

.popup-content {
	display: flex;
	flex-direction: column;
	padding: 0;
	width: 100%;
	background-color: #fff;

	.popup-title {
		width: 100%;
		box-sizing: border-box;
		display: flex;
		align-items: center;
		font-size: 33rpx;
		height: 100rpx;
		line-height: 100rpx;
		padding-left: 30rpx;
		padding-right: 36rpx;
		border-bottom: 1rpx solid #F1F1F1;
	}
}

.bottom-1 {
	display: flex;
	justify-content: center;
	flex: 0 0 auto;
	height: 70rpx;
	padding: $uni-spacing-col-sm * 2 $uni-spacing-row-sm;
	background: $uni-bg-color;
	// border-top: 1rpx solid #979797;
}

</style>